<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>

<link href="css/metro-bootstrap.css" rel="stylesheet">
<link href="css/metro-bootstrap-responsive.css" rel="stylesheet">
<link href="css/iconFont.css" rel="stylesheet">

<!-- Load JavaScript Libraries -->
<script src="js/jquery.min.js"></script>
<script src="js/jquery.widget.min.js"></script>
<script src="js/jquery.mousewheel.js"></script>
<!-- <script src="js/prettify.js"></script> -->




</head>
<body class="metro">

	<div id="divcreatecomp" class="container">
		<div class="row">

			<form id="createcomp">
				<fieldset>
					<legend>Complaint Details</legend>
					<label>Department</label>
					<div class="input-control select">
						<select name="did" id="departmentselect">
							<!-- <option>Construction</option>
							<option>Electrical</option>
							<option>Water</option> -->
						</select>
					</div>
					<label>Location</label>
					<div class="input-control text" data-role="input-control">
						<input name="location" type="text" placeholder="type id">
						<button class="btn-clear" tabindex="-1" type="button"></button>
					</div>
					<label>Description</label>
					<div class="input-control textarea">
						<textarea name="desc"placeholder="enter description"></textarea>
					</div>

					<input type="submit" value="Submit">
				</fieldset>
			</form>

		</div>
	</div>


<script type="text/javascript">

$(document).ready(function(){
	
	//fetch departments from the database
	var options = $("#departmentselect");
	$.getJSON("/ComplaintReg/rest/service/getDepartments",function(data){
		console.log(data);
		
		$.each(data, function() {
			 options.append($("<option />").val(this.did).text(this.dept_name));
		});
	});
	
	 $("#createcomp").submit(function() {
	       
	    	console.log( $("#createcomp").serialize());
	    	//alert("calling login");
			//login();
	    	
	        return false;
	    });
	
	
});

</script>

</body>
</html>